<template>
  <div style="border: 1px solid; padding: 10px;">
    <div>user</div>
    <div>{{user.name}}-{{ user.age }}-{{ user.addr }}</div>
    <button @click="change">edit age</button>
  </div>
</template>

<script setup>
const { user } = defineProps({
  user: {
    type: Object,
    default: () => ({})
  }
})

const emits = defineEmits('change')

function change() {
  emits('change', '23')
}
function foo() {
  console.log('foo')
}

// 暴露给父组件使用
defineExpose({
  change,
  foo
})
</script>

<style scoped>
</style>
